<template>
	<view class="com-b-container">
		<text style="font-size: 32rpx; font-weight: bold; color: #333;">
			子组件B
		</text>
		<view class="b-box" style="margin: 30rpx 0; font-size: 26rpx;">
			<text>CompA组件传进来的值:</text>
			<text class="intent-text-box" style="margin-left: 20rpx; color: #007AFF;">
				{{ result }}
			</text>
		</view>
		<view class="b-box" style="margin-top: 30rpx; display: flex; align-items: center; gap: 20rpx;">
			<text style="font-size: 26rpx;">回传值:</text>
			<input type="text" v-model="callbackValue"
				style="color: blue; border: 1px solid #eee; padding: 10rpx; flex: 1;" />
			<button @click="sendToParent" size="mini" type="warn">
				回传
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		name: "compB",
		data() {
			return {
				result: '',
				callbackValue: ''
			}
		},
		created() {
			this.eventHandler = uni.$on('getIntent', (msg) => {
				console.error("子B接收子A传值：", msg);
				this.result = msg;
			});
		},
		onUnload() {
			uni.$off('getIntent', this.eventHandler);
		},
		methods: {
			sendToParent() {
				if (!this.callbackValue) {
					uni.showToast({
						title: '请先输入回传值',
						icon: 'none'
					});
					return;
				}
				console.warn("子B向父组件回传值：", this.callbackValue);
				this.$emit('callBackFun', this.callbackValue);
			}
		}
	}
</script>

<style scoped>
	.com-b-container {
		padding: 40rpx;
		background-color: #f9f9f9;
		border-radius: 16rpx;
	}
</style>